<template>
    <div>
        <mr-page-head :title="false">
            <div class="clearfix">
                <div class="avatar float-left">
                    <a-avatar
                        :src="
                            `https://gw.alipayobjects.com/zos/rmsportal/jZUIxmJycoymBprLOUbT.png`
                        "
                    />
                </div>

                <div>
                    <div class="title">
                        {{ timeFix }}，{{ '迅鳐科技' }}
                        <span class="welcome-text">，{{ w }}</span>
                    </div>
                    <div>前端工程师 | 迅鳐科技 - 区块链</div>
                </div>
            </div>
        </mr-page-head>
    </div>
</template>

<script>
import { mapState } from 'vuex'
import { timeFix, welcome } from '@/packages/utils/workPlace'
export default {
    data() {
        return {
            timeFix: timeFix(),
            user: {}
        }
    },
    computed: {
        ...mapState({
            // 动态主路由
            // mainMenu: state => state.permission.addRouters
        }),
        w() {
            return welcome()
        }
    }
}
</script>

<style lang="scss" scoped>
.avatar {
    flex: 0 1 72px;
    margin: 0 24px 8px 0;

    & > span {
        border-radius: 72px;
        display: block;
        width: 72px;
        height: 72px;
    }
}

.title {
    font-size: 20px;
    font-weight: 500;

    font-size: 20px;
    line-height: 28px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.85);
    margin-bottom: 16px;
    flex: auto;
}
.logo {
    width: 28px;
    height: 28px;
    border-radius: 4px;
    margin-right: 16px;
}
</style>
